/**
 * ### 数字增长动画
 * @param options.from 动画的起始值
 * @param options.to 动画的结束值
 * @param options.duration 动画的持续时间
 * @param options.onProgress 可选的回调函数，用于在动画进行过程中执行一些操作
 * @example useNumberAnimation({ from: 0, to: 100, duration: 1000, onProgress: (v) => console.log(v) })
 */
export const useNumberAnimation = (options: {
  // from属性表示动画的起始值
  from: number
  // to属性表示动画的结束值
  to: number
  // duration属性表示动画的持续时间
  duration: number
  // onProgress属性是一个可选的回调函数，用于在动画进行过程中执行一些操作
  onProgress?: (v: number) => void
}) => {
  // 解构options对象，获取from、to、duration和onProgress属性
  const { from, to, duration, onProgress } = options
  // 初始化value属性为from属性值
  let value: number = from
  // 计算速度，即(to - from) / duration
  const speed = (to - from) / duration
  // 获取动画开始的时间戳
  const startTime = Date.now()
  // 定义一个run函数，用于执行动画
  const run = () => {
    // 获取当前时间与动画开始时间的差值
    const t = Date.now() - startTime
    // 如果差值大于等于duration，表示动画已经完成
    if (t >= duration) {
      // 将value属性设置为to属性值
      value = to
      // 执行onProgress回调函数，传入value属性值
      onProgress?.(value)
      // 返回，结束动画
      return
    }
    // 计算当前value属性值，即from属性值加上速度乘以差值
    value = from + speed * t
    // 执行onProgress回调函数，传入value属性值
    onProgress?.(value)
    // 使用requestAnimationFrame函数，递归调用run函数，实现动画效果
    requestAnimationFrame(run)
  }
  // 调用run函数，开始动画
  run()
}
